<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Hello jQuery!</title>
    <script src="../resources/js/react.min.js"></script>
    <script src="../resources/js/react-dom.min.js"></script>
    <script src="../resources/js/browser.min.js"></script>
    <script type="text/javascript" src="./js/jquery.min.js"></script>
  </head>
  <body>
      <script type="text/javascript">
        jQuery.foo = function(){
            console.log('This is a test');
        };

        $.foo();

        jQuery.myPlugin = {
            foo:function(){
                console.log("This is ates");
            },
            bar:function(param) {
                console.log('This function take a param, '+param+'.');
            }
        };

        $.myPlugin.foo();
        $.myPlugin.bar('baz');

        (function($){
            $.fn.hilight = function(){
                console.log('hilight()');
            }
        })(jQuery);

        $('#myDiv').hilight();
      </script>
      <div id='myDiv'><div>
      <div id="example"></div>
      <script type="text/javascript">
        var vm = new Vue({
            el: '#example',
            data: {
                message: '123'
            }
        });
        vm.message = 'new message';
      </script>
  </body>
</html>
